<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!-- 生命周期
        beforeCreate:创建前，它还不能访问data与methods
        created:创建后，可以访问data与methods,但还不能访问vue渲染后的dom

        beforeMount:渲染前,还是不能访问vue渲染后的dom
        mounted:渲染后，可以访问vue渲染后的dom
        beforeUpdate:更新前，vue页面上使用的相关数据已修改，但是页面还没有完成渲染
        updated:更新后，vue页面上使用的相关数据已修改且页面已完成相关渲染        
        beforeDestroy：销毁前，准备销毁但是还没有完成销毁，什么都可以做，往往用于销毁 前的善后工作
                        setInterval,scroll监听   hashchange
        destroyed:销毁后，中止了数据与页面的联系，还是可以访问data与methods,但是不能访问vue渲染后的dom
                    还是可以做善后工作
       -->
    <div id="app"></div>
    <script src="./vue.js"></script>
    <script>
      new Vue({
        el: "#app",
        data: {},
      });
    </script>
  </body>
</html>
